<template>
    <div class="customer">
    <div class="tab">
        <el-button class="QueryButton" @click="QueryRabbitAndCustomer()">搜 索</el-button>
        <!--顾客列表-->
        <el-row>
            <!--                <el-col :span="6" v-for="commodity in customerList" :key="commodity.id">-->
            <div>
                <el-table
                        :data="rabbitAndCustomerList"
                        stripe="true"
                        border="true"
                        style="width: 100%">
                    <el-table-column
                            prop="cname"
                            label="名称">
                    </el-table-column>
                    <el-table-column
                            prop="csex"
                            label="性别">
                    </el-table-column>
                    <el-table-column
                            prop="address"
                            label="地址信息">
                    </el-table-column>
                    <el-table-column
                            prop="saleTime"
                            label="购买兔子时间">
                    </el-table-column>
                    <el-table-column
                            prop="varieties"
                            label="兔子品种">
                    </el-table-column>
                    <el-table-column
                            prop="sex"
                            label="兔子性别">
                    </el-table-column>


                </el-table>
            </div>
            <!--                </el-col>-->
        </el-row>
    </div>
    </div>
</template>

<script>
    export default {
        // name: "rabbitAndCustomer",
        data() {
            return {
                pageNum: 1,
                pageSize: 8,
                total: 0,

                QueryForm: {
                    search: ''
                },
                rabbitAndCustomerList: []

            }
        },
        methods: {
            QueryRabbitAndCustomer() {
                this.rabbitAndCustomerList = []
                this.$http.get('/rabbit', {
                    params: {
                        pageNum: this.pageNum,
                        pageSize: this.pageSize,
                        search: this.QueryForm.search
                    }

                }).then(res => {
                    this.rabbitAndCustomerList = res.data.data
                    this.total = res.data.data.total
                    this.pageNum = res.data.data.pageNum
                    this.pageSize = res.data.data.pageSize
                    console.log(res.data.data)
                })
            }
        } ,created() {
            this.QueryRabbitAndCustomer();
        },
    }
</script>

<style scoped>
    @import url("Customer.css");
</style>